<template>
  <div class="box_container">
    <div class="child_box"></div>
    <el-input
        placeholder="请输入内容"
        prefix-icon="el-icon-search"
        v-model="input2">
    </el-input>

  </div>
</template>

<script>
export default {
  name: "MyCircle",
  data(){
    return {
      input2:''
    }
  }
}
</script>

<style scoped>
  .box_container {
    width: 200px;
    height: 200px;
    padding: 10px;
    position: absolute;
    left: 50%;
    top: 50%;
    border-radius: 50%;
    border:3px solid red;
    box-sizing: content-box;
    /*background-color: red;*/
    background-color: aqua;
    /*animation:wave linear 1s infinite;*/
    /*overflow: hidden;*/
  }
@keyframes wave {
  0%,100%{
    width: 200px;
    height: 200px;

  }
  50%{
    width: 250px;
    height: 250px;
  }
}
  .child_box{
    height: 200px;
    width: 200px;
    /*height: 100%;*/
    /*width: 100%;*/
    margin: 0;
    /*left: 50%;*/
    box-sizing: border-box;
    border-radius: 50%;
    border: 3px solid gold;
    background: green;
  }
</style>